.home {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  height: 100%;
  width: 100%;
  background: url('/assets/szxc/assets/img/xx_bg.2ac84150.jpg') no-repeat;
  h2 {
    width: 40%;
    height: 50px;
    background: url('/assets/szxc/assets/img/xx_title.160bedd4.png') no-repeat;
    background-size: 100% 100%;
    margin-bottom: 20px;
  }
  .tabbar {
    display: flex;
    justify-content: center;
    width: 100%;
    padding: 30;
    // background: rgba(104,218,208,.5);
    .box {
      position: relative;
      width: 250px;
      height: 250px;
      margin-right: 40px;
      border-radius: 8px;
      overflow: hidden;
      .content {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        width: 100%;
        height: 100%;
        background: rgba(104,218,208,.5);
        i {
          display: inline-block;
          width: 130px;
          height: 93px;
          transform: scale(0.8);
          background: url(/static/img/nav_icon.b48a76a3.b48a76a3.png) 0px -93px no-repeat;
          background-size: 100%;
          margin: 0.416667rem 0px 0.197917rem;
        }
        span {
          color: #fff;
          font-size: 18px;
        }
      }
      ul {
        position: absolute;
        left: 0;
        top: -300px;
        width: 100%;
        height: 100%;
        z-index: 100;
        box-sizing: border-box;
        padding: 20px;
        background: rgba(255,255,255,0.5);
        transition: top 1s;
        li {
          display: flex;
          flex-direction: column;
          justify-content: center;
          align-items: center;
          font-size: 15px;
          margin-bottom: 10px;
        }
      }
      &:hover ul{
        top: 0;
      }
    }
  }
}